<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
  <title></title>
  <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
  <link rel="stylesheet" href="css/nm.css">
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script>
  <script type="text/javascript" src="js/nm.js"></script>
</head>
<body>
<!-- 新闻 -->
<div data-role="page"  id="pageone">
  <!-- 新闻头部 -->
  <div data-role="header" data-position="fixed" class="header">
    <h1>新闻热点</h1>
    <a href="#pagetwo" data-transition="flip" data-icon="carat-r" data-role="button">天气实况</a>
  </div>
  <!-- 新闻内容 -->
  <div data-role="main" class="ui-content news"></div>
  <!-- 新闻脚部 -->
  <div data-role="footer" data-position="fixed" class="footer">
    <div data-role="navbar">
      <ul>
        <li><a id="toutiao" class="ui-btn-active">头条</a></li>
        <li><a id="shehui">社会</a></li>
        <li><a id="guonei">国内</a></li>
        <li><a id="guoji">国际</a></li>
        <li><a id="yule">娱乐</a></li>
      </ul>
      <ul>
        <li><a id="tiyu">体育</a></li>
        <li><a id="junshi">军事</a></li>
        <li><a id="keji">科技</a></li>
        <li><a id="caijing">财经</a></li>
        <li><a id="shishang">时尚</a></li>
      </ul>
    </div>
  </div>
</div>
<!-- 详细新闻 -->
<div data-role="page" id="pageones">
  <!-- 详细新闻头部 -->
  <div data-role="header" data-position="fixed" class="headers">
    <h1>详细内容</h1>
    <a href="#pageone" data-transition="slide" data-direction="reverse" data-icon="carat-l" data-role="button">返回</a>
  </div>
  <!-- 详细新闻内容 -->
  <div data-role="main" class="ui-content">
    <iframe id="news" src=""></iframe>
  </div>
  <!-- 详细新闻脚步 -->
  <div data-role="footer" data-position="fixed" class="footers">
    <h1>Powered by Lee</h1>
  </div>
</div>
<!-- 天气 -->
<div data-role="page" id="pagetwo">
  <!-- 天气头部 -->
  <div data-role="header" data-position="fixed" class="header">
    <a href="#pageone" data-transition="flip" data-icon="carat-r">新闻热点</a>
    <h1>天气实况</h1>
    <a href="#pagetwos" data-transition="slideup" data-icon="bars">切换城市</a>
  </div>
  <!-- 天气内容 -->
  <div data-role="main" class="ui-content weather">
    <a class="ui-btn ui-corner-all ui-icon-recycle ui-btn-icon-notext">图标</a>
    <div class="weather_content1"></div>
    <div class="weather_content2"></div>
    <div class="weather_content3"></div>
  </div>
  <!-- 天气底部 -->
  <div data-role="footer" data-position="fixed" class="footer">
    <h1>Powered by Lee</h1>
  </div>
</div>
<!-- 其他城市 -->
<div data-role="page" id="pagetwos">
  <!-- 天气头部 -->
  <div data-role="header" data-position="fixed" class="header">
    <a href="#pagetwo" data-transition="slidedown" data-icon="carat-l">天气实况</a>
    <h1>选择城市</h1>
  </div>
  <!-- 天气内容 -->
  <div data-role="main" class="ui-content">
    <div class="searching"><input type="search" name="search" id="search" placeholder="输入城市..."><a href="#pagetwo" data-transition="slidedown" class="search_btn"><button class="ui-btn ui-icon-search ui-btn-icon-notext">搜索</button></a></div>
    <div class="ui-grid-solo">
      <div class="ui-block-a cities">热门城市</div>
    </div>
    <div class="ui-grid-c">
      <div class="ui-block-a citiies_gps"><a href="#pagetwo" data-transition="slidedown">自动定位</a></div>
      <div class="ui-block-b cities"><a href="#pagetwo" data-transition="slidedown">北京</a></div>
      <div class="ui-block-c cities"><a href="#pagetwo" data-transition="slidedown">上海</a></div>
      <div class="ui-block-d cities"><a href="#pagetwo" data-transition="slidedown">广州</a></div>
      <div class="ui-block-a cities"><a href="#pagetwo" data-transition="slidedown">深圳</a></div>
      <div class="ui-block-b cities"><a href="#pagetwo" data-transition="slidedown">天津</a></div>
      <div class="ui-block-c cities"><a href="#pagetwo" data-transition="slidedown">沈阳</a></div>
      <div class="ui-block-d cities"><a href="#pagetwo" data-transition="slidedown">长春</a></div>
      <div class="ui-block-a cities"><a href="#pagetwo" data-transition="slidedown">哈尔滨</a></div>
      <div class="ui-block-b cities"><a href="#pagetwo" data-transition="slidedown">重庆</a></div>
      <div class="ui-block-c cities"><a href="#pagetwo" data-transition="slidedown">武汉</a></div>
      <div class="ui-block-d cities"><a href="#pagetwo" data-transition="slidedown">长沙</a></div>
      <div class="ui-block-a cities"><a href="#pagetwo" data-transition="slidedown">南宁</a></div>
      <div class="ui-block-b cities"><a href="#pagetwo" data-transition="slidedown">海口</a></div>
      <div class="ui-block-c cities"><a href="#pagetwo" data-transition="slidedown">南京</a></div>
      <div class="ui-block-d cities"><a href="#pagetwo" data-transition="slidedown">杭州</a></div>
      <div class="ui-block-a cities"><a href="#pagetwo" data-transition="slidedown">南昌</a></div>
      <div class="ui-block-b cities"><a href="#pagetwo" data-transition="slidedown">济南</a></div>
      <div class="ui-block-c cities"><a href="#pagetwo" data-transition="slidedown">合肥</a></div>
      <div class="ui-block-d cities_gps"><a href="#pagetwo" data-transition="slidedown">郑州</a></div>
    </div>
  </div>
  <!-- 天气底部 -->
  <div data-role="footer" data-position="fixed" class="footer">
    <h1>Powered by Lee</h1>
  </div>
</div>
</body>
</html>
